<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta name="browsermode" content="application">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="Cache" content="no-cache">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <!-- 禁止百度转码 -->
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta name="format-detection" content="telephone=no">
    <title>我的订单</title>
    <link rel="stylesheet" href="${request.contextPath}/web/css/reset.css?v=${verison!}">
    <link rel="stylesheet" href="${request.contextPath}/web/css/base.css?v=${verison!}">
    <link rel="stylesheet" href="${request.contextPath}/web/css/order-detail.css?v=${verison!}">
    <link rel="stylesheet" href="${request.contextPath}/web/css/ydui.css">
    <link rel="stylesheet" href="${request.contextPath}/plug/layui/css/layui.css" media="all">
</head>
<body style="background-color: rgb(245, 245, 245);">
<div data-role="page">
    <div class="app">
        <div class="order-details router">
            <div class="header bg-color-red acea-row row-middle">
                <div class="pictrue">
                    <img src="${request.contextPath}/web/images/5c9ccca151e99.gif">
                </div>
                <div class="data">
                    <div class="state">
                        <#if data.status ==1>
                            请在${data.shouldPayDate?string("yyyy-MM-dd HH:mm:ss")}前完成支付
                        <#elseif data.status ==2>
                            商家处理中,请耐心等待
                        <#elseif data.status ==3>
                            商家已发货
                        <#elseif data.status ==4>
                            已收货，快去评价一下吧
                        <#elseif data.status ==5>
                            交易完成，感谢您的支持
                        <#elseif data.status ==6>
                            拼团商品，等待拼团成功
                        </#if>
                    </div>
                    <div>${data.changeDate?string("yyyy-MM-dd")}
                        <span class="time">${data.changeDate?string("HH:mm:ss")}</span>
                    </div>
                </div>
            </div>
            <div class="nav">
                <div class="navCon acea-row row-between-wrapper">
                    <div class="<#if data.status ==1>on</#if>">待付款</div>
                    <div class="<#if data.status ==2>on</#if>">待发货</div>
                    <div class="<#if data.status ==3>on</#if>">待收货</div>
                    <div class="<#if data.status ==4>on</#if>">待评价</div>
                    <div class="<#if data.status ==5>on</#if>">已完成</div>
                </div>
                <div class="progress acea-row row-between-wrapper">
                    <div class="iconfont icon-webicon318 font-color-red"></div>
                    <div class="line"></div>
                    <div class="iconfont icon-yuandianxiao"></div>
                    <div class="line"></div>
                    <div class="iconfont icon-yuandianxiao"></div>
                    <div class="line"></div>
                    <div class="iconfont icon-yuandianxiao"></div>
                </div>
            </div>
            <div class="address">
                <div class="name">
                    ${data.userName!}
                    <span class="phone">${data.userPhone!}</span>
                </div>
                <div>${data.userAddress!}</div>
            </div>
            <div class="orderGoods">
                <div class="total">共${data.totalNum!}件商品</div>
                <div class="goodWrapper">
                    <#list data.cartInfo as item>
                        <div class="item acea-row row-between-wrapper">
                            <div class="pictrue">
                                <img src="${item.image!}"
                                     class="image">
                            </div>
                            <div class="text">
                                <div class="acea-row row-between-wrapper">
                                    <div class="name line1">${item.goodsName!}</div>
                                    <div class="num">x ${item.totalNum!}</div>
                                </div>
                                <div class="attr line1">${item.goodsAttr!}</div>
                                <div class="money font-color-red">￥${item.webSinglePrice!}</div>
                                <#if data.status ==4>
                                    <a href="${request.contextPath}/web/addComment/${item.id!}">
                                        <div class="evaluate">
                                            评价
                                        </div>
                                    </a>
                                </#if>
                            </div>
                        </div>
                    </#list>
                </div>
            </div>
            <div class="wrapper">
                <div class="item acea-row row-between">
                    <div>订单编号：</div>
                    <div class="conter acea-row row-middle row-right">${data.orderId!}
                        <span class="copy copy-data" data-clipboard-text="${data.orderId!}">复制</span>
                    </div>
                </div>
                <div class="item acea-row row-between">
                    <div>下单时间：</div>
                    <div class="conter">${data.createDate?string("yyyy-MM-dd HH:mm:ss")}</div>
                </div>
                <div class="item acea-row row-between">
                    <div>订单类型：</div>
                    <div class="conter">
                        <#if data.orderType == 1>
                            普通订单
                        <#elseif data.orderType == 2>
                            秒杀订单
                        <#elseif data.orderType == 3>
                            拼团订单
                        </#if>
                    </div>
                </div>
                <div class="item acea-row row-between">
                    <div>支付状态：</div>
                    <div class="conter">
                        <#if data.payTime??>
                            已支付
                        <#else>
                            未支付
                        </#if>
                    </div>
                </div>
                <div class="item acea-row row-between">
                    <div>支付方式：</div>
                    <div class="conter">
                        <#if data.payType??>
                            <#if data.payType == 1>
                                微信支付
                            <#elseif data.payType == 2>
                                积分支付
                            <#elseif data.payType == 3>
                                微信积分组合支付
                            </#if>
                        <#else>
                            暂未支付
                        </#if>
                    </div>
                </div>
            </div>
            <div class="wrapper">
                <div class="item acea-row row-between">
                    <div>支付金额：</div>
                    <div class="conter">￥${data.webTotalPrice!}</div>
                </div>
                <div class="item acea-row row-between">
                    <div>积分抵扣：</div>
                    <div class="conter">-￥${data.useScore!}</div>
                </div>
                <div class="actualPay acea-row row-right">
                    实付款：<span class="money font-color-red">￥${data.webPayPrice!}</span>
                </div>
            </div>
            <div style="height: 1.2rem;"></div>
            <div class="footer acea-row row-right row-middle">
                <#if data.status ==1>
                    <div class="bnt cancel" onclick="deleteOrder('${data.orderSeq!}')">
                        取消订单
                    </div>
                    <a href="${request.contextPath}/web/orderSubmit/${data.orderSeq!}" class="bnt bg-color-red">
                        立即付款
                    </a>
                <#elseif data.status ==2>
                    <div class="bnt cancel" onclick="deleteOrder('${data.orderSeq!}')">
                        取消订单
                    </div>
                <#elseif data.status ==3>
                    <a href="javascript:void(0);" class="bnt bg-color-red" onclick="confirm('${data.orderSeq!}')">
                        确认收货
                    </a>
                <#elseif data.status ==4>
                    <a href="javascript:void(0)" class="bnt bg-color-red" onclick="finish('${data.orderSeq!}')">
                        完成订单
                    </a>
                <#elseif data.status ==5>
                    <div class="bnt cancel" onclick="deleteOrder('${data.orderSeq!}')">
                        删除订单
                    </div>
                <#elseif data.status ==6>
                    <div class="bnt cancel" onclick="deleteOrder('${data.orderSeq!}')">
                        删除订单
                    </div>
                </#if>
            </div>
        </div>
    </div>
    <#include "include/right.html" />
</div>
</body>
<script type="text/javascript" src="${request.contextPath}/web/js/media_750.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/jquery.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/jquery.mobile.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/clipboard.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/ydui.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/common.js"></script>
<script src="${request.contextPath}/js/layer.js"></script>
<script>
    $(function () {
        var copybtn = document.getElementsByClassName("copy-data");
        var clipboard = new ClipboardJS(copybtn);
        clipboard.on("success", function () {
            YDUI.dialog.toast("复制成功", "success", 1000);
        });
    })
    function deleteOrder(id){
        $.ajax({
              type: 'POST',
              url: '${request.contextPath}/web/order/delete/'+id,
              dataType:'json',
              contentType:'application/json',
              success: function(data){
                  if(data.code==200){
                        window.location.href="${request.contextPath}/web/myOrder?status=${data.status}";
                  }else{
                     layer.msg(data.msg)
                  }
              }
        });
    }
    function confirm(id){
        $.ajax({
              type: 'POST',
              url: '${request.contextPath}/web/order/confirm/'+id,
              dataType:'json',
              contentType:'application/json',
              success: function(data){
                  layer.msg(data.msg)
                  if(data.code==200){
                   window.location.href="${request.contextPath}/web/myOrder?status=4";
                  }
              }
        });
    }
    function finish(id){
        $.ajax({
              type: 'POST',
              url: '${request.contextPath}/web/order/finsish/'+id,
              dataType:'json',
              contentType:'application/json',
              success: function(data){
                  layer.msg(data.msg)
                  if(data.code==200){
                   window.location.href="${request.contextPath}/web/myOrder?status=5";
                  }
              }
        });
    }
    function detail(id){
        window.location.href="${request.contextPath}/web/orderDetail/"+id;
    }
</script>
</html>